什么是箭头函数

标签:2024-05-16 09:32:26

箭头函数是在es6或更高版本中编写函数的表达式

箭头函数可以更简洁地定义函数,使用箭头(=>)符号来替代传统的function关键字。这种函数定义方式可以使代码更加简洁易读。

箭头函数有以下几种语法形式:

1、基本形式 :(parameters) => { function body }

示例:

// 传统函数
function fn(name) {
  console.log('Hello, ' + name + '!');
}
 
// 箭头函数
const fn = (name) => {
  console.log('Hello, ' + name + '!');
}

2、简写形式(如果只有一个参数可以省略括号,如果函数体只有一行可以省略大括号和return关键字): parameter => expression

示例:

// 传统函数
function square(a) {
  return a * a;
}
 
// 箭头函数
const square = a => a * a;

3、使用在对象中时,可以使用简写形式以创建对象方法:

const person = {
  name: 'John',
  age: 30,
  fnA: function() {
    console.log('Hello, my name is ' + this.name + '.');
  },
  fnB: () => {
    console.log('I am ' + this.age + ' years old.'); // 此处的this指向的是箭头函数的上下文(global对象或者undefined)
  }
};
 
person.fnA(); // Hello, my name is John.
person.fnB();   // I am undefined years old.

需要注意的是,在使用箭头函数时,this指向的是函数定义时的上下文,而不是函数执行时的上下文,这可能会与传统函数的语法形式有所不同。

原文出处:http://www.dongblog.com/notes/56.html
来源:博客网 转载请注明出处!

活跃用户

少龙
Ta还没有签名
烃羰龙
Ta还没有签名
孤雨梦倾城
Ta还没有签名
扬州牧新自动化
Ta还没有签名

友情链接


Warning: Smarty error: unable to read resource: "../../../templates/default/./common/foot/footer_index.htm" in /usr/home/hyu3925200001/htdocs/common/smarty/Smarty.class.php on line 1093

Warning: Smarty error: unable to read resource: "../../../templates/default/./common/foot/footer_index.htm" in /usr/home/hyu3925200001/htdocs/common/smarty/Smarty.class.php on line 1093